<template>
  <!--立项信息-->
    <div>
        <public-table
                ref="publicTableRef"
                index
                :is-paging="false"
                :selection="false"
                :indexWidth="'100'"
                :header-cell-style="{'background':'#f7f7fa'}"
                border
                :page="page"
                :tableData="tableData"
                :tableOption.sync="tableOption"
                @page-change="onPageChange"
        >
            <template #buttons="scope">
<!--                <el-button
                        color="#FC7018"
                        style="color: #FFFFFF;"
                        @click="onView(scope.row)"
                >查看</el-button>   -->
                <el-button class="button_view" @click="download(scope.row)">附件下载</el-button>
            </template>
        </public-table>
    </div>
    <public-dialog
            :title="'立项信息详情'"
            :width="'60%'"
            :confirmButtonTitle="'保存'"
            v-model:visible="visible"
            @onConfirm="onConfirm"
            :footer-button="false"
    >
        <CommonTitle class="m-b20" titleName="会议信息"></CommonTitle>
        <el-form label-width="80px">
            <el-row>
                <el-col :span="12">
                    <el-form-item label="项目名称">
                        <el-input v-model="state.approveInfo.projectName" disabled placeholder="" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="会议名称">
                        <el-input v-model="state.approveInfo.meetingTopics" disabled placeholder="" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="参会人员">
                        <el-input v-model="state.approveInfo.participants" disabled placeholder="" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="会议时间">
                        <el-input :placeholder="state.approveInfo.planStartTime+'-'+state.approveInfo.planEndTime" disabled />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="会议内容">
                        <el-input v-model="state.approveInfo.meetingMinutes" disabled  />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="会议附件">
                        <svg-icon icon-class="investment-icon-home" class="status-icon m-r5" />
                        <span style="cursor: pointer;">附件</span>
                        <span  style="cursor: pointer;" class="m-l5">下载</span>
                    </el-form-item>
                </el-col>
            </el-row>

            <CommonTitle class="m-b20" titleName="审批信息"></CommonTitle>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="审批人">
                        <el-input v-model="state.approveInfo.user" disabled placeholder="" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="审批时间">
                        <el-input v-model="state.approveInfo.user" disabled placeholder="" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="审批结果">
                        <el-input v-model="state.approveInfo.user" disabled placeholder="" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="审批意见">
                        <el-input v-model="state.approveInfo.user" disabled placeholder="" />
                    </el-form-item>
                </el-col>

            </el-row>
        </el-form>
    </public-dialog>
    <div class="button-wrap d-flex a-center j-center m-t20">
        <el-button class="button_cancel" @click="goBack">返回</el-button>
    </div>
</template>

<script setup>
import {useRouter} from "vue-router";
import {reactive, ref} from "vue";
import PublicTable from "@/components/PublicTable.vue";
import {ElCol, ElForm, ElMessage, ElRow} from "element-plus";
import PublicDialog from "@/components/PublicDialog.vue";
import CommonTitle from "@/components/CommonTitle.vue";
import {investmentProjects, reserveInvestmentProjectLibraryApi} from "@/api/investment";
import {exportFile} from "@/common/utils/GlobalUtils";

const router = useRouter();
const projectId  = router.currentRoute.value.params.projectId;

const state = reactive({
    approveInfo:{}
});
const visible = ref(false);

const page = reactive({
    total: 0,
    current: 1,
    size: 50,
});

const tableData = ref([]);
const tableOption = ref([
  { label: "会议议题", prop: "meetingTopics", minWidth: 120 },
  { label: "参会人", prop: "participants", minWidth: 100 },
  { label: "会议记录", prop: "meetingMinutes", minWidth: 100 },
  {
    label: "审批结果", prop: "examineStatus", formatter: (val, row) => {
      return ['', '审批中', '已通过', '已驳回'][val] || '-';
    }, minWidth: 100
  },
  { label: "审批意见", prop: "approvalOpinions", minWidth: 100 },
  { label: "审批时间", prop: "updateTime", minWidth: 150 },
  { label: "审批人", prop: "userName", minWidth: 100 },
  {
    label: '操作',
    slot: true,
    width: 200,
    overHidden: false,
    slotName: 'buttons',
      fixed: "right"
  },
]);

/**
 * 投资项目立项
 */
const getData = (params,callback) => {
    reserveInvestmentProjectLibraryApi.getInvestmentApprovalPage2({projectId:projectId}).then(res=>{
        if(res.code==='200'){
            tableData.value = [res.data];
            if(callback)callback(res);
        }
    })
}

/**
 * 查看立项审批单
 */
const getProjectApproval = (projectId) => {
   /* investmentProjects.getProjectApproval(projectId).then(res=>{
        if(res.code === '200'){
            state.approveInfo = res.data;
        }
    });*/
    getData({projectId:projectId},(res)=>{
        state.approveInfo = res.data;
        console.log('state.approveInfo',state.approveInfo)
    });
}

/**
 * 查看
 * @param row
 */
const onView = (row) => {
  getProjectApproval(row.projectId);
  visible.value = true;
}

/**
 * 返回
 */
const goBack = () => {
    // router.push({path:`/investmentProjectManagement/investmentProjects/investmentProjectInformation/investmentProjectsList`});
    router.go(-1);
}

/**
 * 弹窗确认
 */
const onConfirm = () => {

}

const download = (row) => {
    if(row.fileUrlKey){
        reserveInvestmentProjectLibraryApi.getPlanWord({templateUrlKey:row.fileUrlKey}).then(res=>{
            if(res){
                let fileName = `立项信息附件`;
                let fileType = row.fileUrlKey.split('.')[row.fileUrlKey.split('.').length-1];
                let blobType = 'application/vnd.openxmlformats-officedocument.wordprocessingml.document;charset=UTF-8';
                exportFile(res,fileName,fileType,blobType);
            }
        });
    }else{
        ElMessage.error('下载链接不存在,请联系管理员!');
    }
}

defineExpose({
    getData,
});
</script>

<style scoped>

</style>
